<template>
    <el-main>
        <div class="row mb-1">
            <Addteamhome ref="adduserview" :ID="IID" :teamhome="teamhome" :teamid="ID" :start="start"
                :close="() => (IID = null)"></Addteamhome>


        </div>
        <div class="row mb-1">
            <div class="col">
                <el-table border :data="tableData" height="65vh" style="width: 100%">
                    <el-table-column sortable type="index"></el-table-column>
                    <el-table-column sortable prop="country" label="国家"></el-table-column>
                    <el-table-column sortable prop="province" label="省"></el-table-column>
                    <el-table-column sortable prop="city" label="城市">
                    </el-table-column>
                    <el-table-column sortable prop="area" label="区"></el-table-column>
                    <el-table-column sortable prop="street" label="街道">
                    </el-table-column>
                    <el-table-column prop="longitude" label="经度"></el-table-column>
                    <el-table-column prop="dimension" label="维度"></el-table-column>
                    <el-table-column prop="home" label="详细地址"></el-table-column>
                    <el-table-column prop="school" label="学校"></el-table-column>
                    <el-table-column prop="organization" label="组织"></el-table-column>
                    <el-table-column prop="company" label="公司"></el-table-column>
                    <el-table-column prop="user" label="个人"></el-table-column>
                    <el-table-column label="操作" width="230">
                        <template #default="scope">
                            <el-button size="default" @click="change(scope.row.ID)">修改</el-button>
                            <el-button size="default" type="danger" @click="delteamhome(scope.row.ID)">删除</el-button>
                        </template>
                    </el-table-column>
                </el-table>
            </div>
        </div>
    </el-main>
</template>
  
<script setup lang="ts">
import { ref, computed, watch, onMounted } from "vue";
import { ElMessage, ElMessageBox } from "element-plus";
import study from "../../../mysql_interface/studycodemodel";
import { asyncselectteamhome, asyncdelteamhome } from "../../../api/index";
import Addteamhome from "./addteamhome.vue";
import Studycodemodel from "../../../mysql_interface/studycodemodel";
const p = defineProps<{ ID: number, team: Studycodemodel.Iteam }>()

const tableData = ref<study.Iteamhome[]>([]);
const IID = ref(0);
const ID = computed<number>(() => {
    return Number(p.ID);
});

const like = ref('')

const adduserview = ref();



const teamhome = computed<study.Iteamhome>(() => {
    if (IID.value) return tableData.value.find((v) => v.ID == IID.value) || {}
    return {};
});
onMounted(() => {
    start();
});

watch(
    () => ID,
    () => {
        start();
    }
);

async function start() {
    if (ID.value) {
        if (like.value) {

        }
        const data = await asyncselectteamhome({ teamid: ID.value });
        tableData.value = data.rows;
    } else {
        ElMessage.error("没有此团队");
    }
}

function change(ID: number) {
    if (adduserview.value) {
        adduserview.value.setdialogVisible(true);
        IID.value = ID;
    }
}

function create() {
    IID.value = 0;
}

async function delteamhome(ID: number) {
    ElMessageBox.confirm("是否删除？", "警告", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
    })
        .then(() => {
            asyncdelteamhome({ ID })
                .then(() => {
                    ElMessage.success("删除成功");
                    start();
                })
                .catch((e) => {
                    ElMessage.error("删除失败" + e);
                });
        })
        .catch(() => { });
}


</script>
  